<template>
  <div v-loading="loading" v-for="item in data">
    {{
      item.data
        .map((item) => {
          return item.message;
        })
        .join(',')
    }}
  </div>
</template>
<script setup lang="ts">
import { useRequest } from '../../packages/hooks/useRequest';

const [loading, getData, data] = useRequest(
  [
    () => {
      return new Promise<{ data: { message: string; value: string }[] }>((resolve) => {
        setTimeout(() => {
          resolve({
            data: [{ message: 'message1', value: 'value1' }]
          });
        }, 1000);
      });
    },
    () => {
      return new Promise<{ data: { message: string; value: string }[] }>((resolve) => {
        setTimeout(() => {
          resolve({
            data: [{ message: 'message2', value: 'value2' }]
          });
        }, 1000);
      });
    }
  ],
  {
    immediate: true,
    success: (res) => {
      res.forEach((item) => {
        item.data.forEach((dd) => {
          console.log(dd.message);
        });
      });
    }
  }
);
</script>
